<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>登录</title>
    <script src="https://code.jquery.com/jquery-3.0.0.min.js"></script>
    <style>
        .login_box{
            width: 300px;
            height: 250px;
            background-color: #2e6da4;
            margin: 100px auto;

            /*text-align: center;*/

        }
        ul{
            list-style-type: none;
            margin-top: 50px;

        }
    </style>
</head>
<body>
<div class="login_box">
    <form class="login" id="login">
        <ul>
    <li>用户名：<input type="text" name="username" id="username"></li><br>
    <li>密&nbsp;&nbsp;&nbsp;&nbsp;码：<input type="password" name="password" id="password"></li><br>
    <li><a href="/index/register">注册</a>
        <a href="/index/retrieve">找回密码</a>
        <input type="button" value="登录" class="login_in"></li>
        </ul>
    </form>
</div>
</body>
<script>
    $(".login_in").click(function(){
        var username=$('#username').val();
        var password=$('#password').val();
        if(username=="" || username==null){
            alert("用户名不能为空");
            $("#username").focus();
            return false;
        }
        if(password=="" || password==null){
            alert("密码不能为空");
            $("#password").focus();
            return false;
        }
        $.ajax({
            url:'/index/login_in',
            data:{'username':username,'password':password},
            dataType:'json',
            async:false,
            type:'post',
            success:function(data){
                if(data.status == 1){
                    alert('登陆成功');
                    window.location.href='/index/index';
                }else{
                    alert('用户名或密码错误');
                    return false;
                }
            }
        })

    })

</script>
</html>